<template>
	<view>
		<template v-if="sn && order.id">
			<!-- 订单状态 -->
			<div class="info-view order-view">
				<div class="order-status" v-if="orderStatusList[order.status]">
					{{ orderStatusList[order.status].title }}
					<div>{{ orderStatusList[order.status].value }}</div>
				</div>

			</div>
			<!-- 地址 -->
			<view class="info-view" style="margin-top:-15px;" v-if="order.logistics_type != '1'">
				<view class="address-view">
					<view>
						<view class="address-title">
							<span>{{order.address_data.name}}</span>
							<span>{{order.address_data.mobile}}</span>
						</view>
						<view class="address">地址：{{order.address_detail_data_text}}
						</view>
					</view>
				</view>
			</view>

			<!-- 物流信息 -->
			<view class="info-view logistics-view" v-if="order.logistics_type != '1' && order.shipping_tracking_number">
				<view class="logistics-List">
					<view class="flex align-center logi-view fs-28" v-if="true">
						<view class="verificationCode">
							当前物流单号:{{order.shipping_tracking_number}}
						</view>
						<text class="ml-2 fte87722 fs-28" @click="onCopy(order.shipping_tracking_number)">
							复制
						</text>
					</view>
					<view v-else class="logistics-List-title">
						{{ '暂无物流信息' }}
					</view>
				</view>
			</view>

			<!-- 提货地址 -->
			<view class="info-view flex flex-column" style="margin-top:-15px;" v-if="order.logistics_type == '1'">
				<view class="fs-24 flex align-center">
					<view class="title mr-2">自提点地址:</view>
					<view class="address-line-height flex justify-between flex-1 align-center fte87722 fs-24"
						@tap="openBuiltInMap()">
						{{order.merchant.merchant_address}}{{order.merchant.detail_address}}

						<uni-icons class="" type="right" color="#333" size="15"></uni-icons>

					</view>
				</view>
				<view class="fs-24 flex align-center" @click="callPhone">
					<view class="title mr-2">联系方式:</view>
					<view class="value">{{order.merchant.contact_mobile}}<uni-icons class="ml-2" name='phone-filled'></uni-icons>
					</view>
				</view>
			</view>

			<!-- 商品信息 -->
			<view>
				<view class="seller-view">
					<!-- 店铺名称 -->
					<view class="seller-info u-flex u-row-between">
						<view class="seller-name" @click="goToShopPage(order)">
							<view class="name" v-if="order.merchant">{{order.merchant.merchant_name}}</view>
							<view class="flex align-center">
								<view class="ftf40b0b bdf40b0b fs-24 border px-2 rounded py-1" v-if="orderStatusList[order.status]"> {{ orderStatusList[order.status].title
								}}</view>
								<text v-if="isOverdue() && order.status == 4" class="border px-2 rounded fs-24 ml-2 py-1"
									:style="{'color':'#e87722','border-color':'#e87722'}">已逾期</text>
							</view>
						</view>
						<view class="order-sn"></view>
					</view>
					<view>
						<view class="goods-item-view">
							<view class="goods-img" @click="gotoGoodsDetail()">
								<u-image border-radius="6" width="131rpx" height="131rpx" :src="order.goods_image"></u-image>
							</view>
							<view class="goods-info" @click="gotoGoodsDetail()">
								<view class="goods-title u-line-2">{{ order.goods_name }}</view>
								<view class="fs-24 ft666666">规格：{{ruleText}}</view>
								<view class="goods-price">
									￥{{day_amount}}/天
								</view>
							</view>
							<view class="goods-num">
								<view>x{{order.goods_num}}</view>
							</view>
						</view>
					</view>
					<view class=" flex align-center justify-center flex-1 mx-2 fs-28 ft666666 mt-3"
						v-if="overdueTimeShow() > 0 && order.status == 4">
						<text>即将逾期：</text>
						<view style="width: 70px;">
							<u-count-down :timestamp="overdueTimeShow()" :show-days="false" font-size="28" separator-color="#e87722"
								color="#e87722"></u-count-down>
						</view>
					</view>
					<view class="flex align-center fs-24 bg-linear1 text-white rounded-circle mx-2 py-1 mt-2 px-2"
						v-if="order.recent_end">
						<view class="flex-1 flex align-center">
							<view class="bg-white fte87722 font-icon mr-2">始</view>
							<view class="flex flex-column">
								<text>起租日</text>
								<text>{{order.rencent_start.split(' ')[0]}}</text>
							</view>
						</view>
						<view class="flex-1 flex align-center">
							<view class="bg-white fte87722 font-icon mr-2">还</view>
							<view class="flex flex-column">
								<text>归还日</text>
								<text>{{order.recent_end.split(' ')[0]}}</text>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="info-view flex flex-column">
				<view class="order-info-view">
					<view class="title">押金：</view>
					<view class="value font-weight-bold">￥{{ order.all_deposit_money}}</view>
				</view>
				<view class="order-info-view">
					<view class="title">租金 ：</view>
					<view class="value font-weight-bold">￥{{ order.first_recent_money}}</view>
				</view>
				<view class="order-info-view">
					<view class="title">商品总价：</view>
					<view class="value font-weight-bold">￥{{ order.order_money}}</view>
				</view>
			</view>
			<view class="info-view">
				<view style="width: 100%">
					<view class="order-info-view">
						<view class="title">订单编号：</view>
						<view class="value">
							{{ order.order_agreement_no }}
							<text class="copy" @click="onCopy(order.order_agreement_no)">复制</text>
						</view>
					</view>
					<view class="order-info-view">
						<view class="title">下单时间：</view>
						<view class="value">{{order.create_time }}</view>
					</view>
					<view class="order-info-view">
						<view class="title">订单备注：</view>
						<view class="value">{{order.remark || '暂无备注'}}</view>
					</view>
					<view class="order-info-view">
						<view class="title">支付状态：</view>
						<view class="value">
							{{order.status == "0" ? "未付款" : "已付款" }}
						</view>
					</view>
					<view class="order-info-view flex align-center fs-24" v-if="order.sign_status == 2">
						<view class="title">租赁合同：</view>
						<view class="value" style="color:#e87722" @tap="viewContract">查看合同</view>
					</view>
				</view>
			</view>

			<!-- <view class="info-view" v-if="order.status != '0'">
				<view>
					<view class="invoice-info-view">
						<view class="invoice-title">发票信息：</view>
						<view class="value">无需发票</view>
					</view>
				</view>
			</view> -->
			<view style="height: 260rpx"></view>

			<view class="bottom_view pb-4 pt-1">
				<!--#ifdef MP-ALIPAY-->
				<view class="fte87722 fs-20 px-2">租赁押金将从您的支付宝账户中被冻结，而不是直接被扣除，待归还物品后将自动解冻</view>
				<!--#endif-->
				<view class="btn-view flex align-center justify-between">
					<view class="description pl-3">
						<text v-if="order.status != '0'">已付金额:</text>
						<text v-else>应付金额:</text>
						<text class="price">￥{{ order.order_money}}</text>
					</view>
					<view class="flex justify-end align-center">
						<view class="bge87722 text-white fs-24 flex align-center px-3 rounded-circle mr-2" style="height: 60rpx;"
							v-if="order.status == '0'" @click="waitPay(order)">去支付</view>
						<view class="bge87722 text-white fs-24 flex align-center px-3 rounded-circle mr-2" style="height: 60rpx;"
							v-if="order.status == '3'" @click="onRog(order)">
							确认收货</view>
						<view class="bge87722 text-white fs-24 flex align-center px-4 rounded-circle mr-2" style="height: 60rpx;"
							v-if="order.status == '10' || order.status == '4'" @click="handleOrder(order,'returnGoods')">
							归还</view>
						<view class="bge87722 text-white fs-24 flex align-center px-4 rounded-circle mr-2" style="height: 60rpx;"
							v-if="order.status == '10' || order.status == '4'" @click="handleOrder(order,'renewalOrder')">
							续租</view>
						<view class="bge87722 text-white fs-24 flex align-center px-4 rounded-circle mr-2" style="height: 60rpx;"
							v-if="order.status == '10' || order.status == '4'" @click="handleOrder(order,'buyoutOrder')">
							买断</view>
						<view v-if="order.status == '1'" class="fte87722 flex align-center px-3 rounded-circle border bde87722 mr-2"
							style="height: 60rpx;" @click="showCode()">二维码提货
						</view>
						<view class="ft999999 border bd999999 fs-24 flex align-center px-3 rounded-circle mr-2"
							style="height: 60rpx;" v-if="order.status == '0'" @click="onCancel(order.id)">取消订单</view>

						<!-- <view class="bge87722 text-white fs-24 flex align-center px-4 rounded-circle mr-2" style="height: 60rpx;"
							v-if="order.status == '10' || order.status == '4'" @click="handleOrder(order,'buyoutOrder')">
							退款</view> -->
					</view>
				</view>
			</view>
			<u-popup class="cancel-popup" v-model="cancelShow" mode="bottom" length="30%">
				<view class="header text-center pt-4">取消订单</view>
				<view class="body py-2">
					<view class="title text-center px-3">取消订单后，本单享有的优惠可能会一并取消，是否继续？</view>
				</view>
				<view class="footer flex align-center justify-center">
					<view class="ft999999 border bd999999 rounded-circle py-1 text-center" style="width: 200rpx;"
						@click="cancelShow = false">取消
					</view>
					<view class="ml-5 bde87722 border fte87722 rounded-circle py-1 text-center" style="width: 200rpx;"
						@click="submitCancel">提交
					</view>
				</view>
			</u-popup>
			<u-modal v-model="rogShow" :show-cancel-button="true" :title="title" :content="content"
				:confirm-color="lightColor" @confirm="confirmRog"></u-modal>

			<!--物流归还商品-->
			<u-modal :confirm-color="lightColor" v-model="wlShow" :show-cancel-button="true" title="归还商品"
				@confirm="confirmWl">
				<view class="flex flex-column align-center pt-5 mb-4 px-2">
					<input class="w-100 text-center" type="text" v-model.trim="logisticsNo" placeholder="请输入物流单号">
				</view>
			</u-modal>

			<payListTemple ref="payList" @checkPay="toPay"></payListTemple>
		</template>
	</view>
</template>

<script>
	import {
		cancelOrder,
		getOrderDetail,
		getSignUrl,
		paymentCreate,
		returnGoods,
		renewalOrder,
		buyoutOrder,
		confirmReceive,
	} from "@/api/order.js";
	import storage from "@/utils/storage";
	import config from '@/config/api.js'
	import payListTemple from './components/pay-list.vue'
	export default {
		components: {
			payListTemple
		},
		data() {
			return {
				lightColor: this.$lightColor,
				logisticsList: "", //物流信息
				shareFlag: false, //拼团分享开关
				orderStatusList: {
					'0': {
						title: "未付款",
						value: "商品暂未付款",
					},
					'2': {
						title: "待发货",
						value: "商品等待发货中",
					},
					'3': {
						title: "已发货",
						value: "商品已发货,请您耐心等待",
					},
					'10': {
						title: "租赁中",
						value: "商品使用中",
					},
					'4': {
						title: "待归还",
						value: "商品待归还",
					},
					'5': {
						title: "运输中",
						value: "商品运输中",
					},
					'9': {
						title: "已买断",
						value: "商品已购买",
					},
					'8': {
						title: "已取消",
						value: "订单已取消",
					},
					'6': {
						title: "已完成",
						value: "订单已完成,祝您生活愉快",
					},
					'1': {
						title: "待自提",
						value: "商品正在等待提取",
					},
				},
				order: {
					sku_data: {
						price: 0
					},
					address_data: {
						name: '',
						mobile: ''
					}
				},
				cancelShow: false, //取消订单
				orderSn: "",
				orderGoodsList: "", //订单中商品集合
				orderDetail: "", //订单详情信息
				sn: "",
				cancelList: "",
				rogShow: false,
				reason: "",
				orderPackage: "",
				cancel_reason: '',
				content: '是否确认收货?',
				orderType: '',
				wlShow: false,
				logisticsNo: '',
				renewalDays: '',
				title: '',
			};
		},
		computed: {
			ruleText() {
				if (!this.order.sku_data || !this.order.sku_data.spec_attrs) return ''
				const attr = this.order.sku_data && this.order.sku_data.spec_attrs
				let str = []
				Object.keys(attr).forEach(key => {
					if (key == '租期') {
						str.push(attr[key] + '天')
					} else {
						str.push(attr[key])
					}
				})
				return str.join(',')
			},
			day_amount() {
				const sku_data = this.order.sku_data
				if (!sku_data.spec_attrs) return 0
				return Number(sku_data.price / sku_data.spec_attrs['租期']).toFixed(2)
			}
		},
		onLoad(options) {
			const token = storage.getAccessToken();
			const pay_sn = uni.getStorageSync('pay_sn')
			if (!token) {
				uni.setStorageSync('toPay', `/pages/order/orderDetail?sn=${pay_sn}&type=pay`)
				uni.removeStorageSync('pay_sn')
				uni.redirectTo({
					url: '/pages/passport/login'
				})
				return
			}
			this.sn = options.sn || pay_sn
			uni.removeStorageSync('pay_sn')
			this.loadData(this.sn);
		},
		onShow() {
			if (this.order.id)
				this.loadData(this.sn);
		},
		methods: {
			isOverdue() {
				// this.order.recent_end = '2025-11-22 21:09:46'
				const flag = (new Date(this.order.recent_end).getTime() + 86400000) - (this.order.now * 1000) < 0
				if (flag) {
					return true
				}
				return false
			},
			overdueTimeShow() {
				// this.order.recent_end = '2025-11-22 21:09:46'
				const timer = (new Date(this.order.recent_end).getTime() + 86400000) - (this.order.now * 1000)
				// console.log('timer-----', timer)
				return timer / 1000
			},
			viewContract() {
				uni.navigateTo({
					url: `/pages/navigation/webview?type=READ_FILE&sn=${this.sn}&status=2`
				})
			},
			openBuiltInMap() {
				const item = this.order.merchant
				uni.openLocation({
					// 目标经纬度（必填）
					latitude: Number(item.latitude),
					longitude: Number(item.longitude),
					// 目标名称（显示在地图上）
					name: item.merchant_name,
					// 详细地址（点击气泡时显示）
					address: `${item.merchant_address}${item.detail_address}`,
					// 缩放级别（1-28，默认16）
					scale: 16,
					success: () => {
						console.log("打开内置地图成功");
					},
					fail: (err) => {
						console.error("打开地图失败：", err);
						uni.showToast({
							title: "导航失败，请重试",
							icon: "none"
						});
					}
				});
			},
			handleOrder(order, type) {
				this.orderSn = order;
				this.orderType = type
				if (type === 'returnGoods') {
					if (this.orderSn.logistics_type == 2) {
						this.wlShow = true
					} else {
						uni.navigateTo({
							url: `/pages/order/scanCode?sn=${this.orderSn.id}&type=return`
						})
					}
				} else if (type === 'renewalOrder') {
					this.title = '续租商品'
					this.content = '是否确认续租商品？'
					this.rogShow = true;
				} else if (type === 'buyoutOrder') {
					this.title = ''
					this.content = '是否确认买断商品？'
					this.rogShow = true;
				}
			},
			showCode() {
				uni.navigateTo({
					url: `/pages/order/scanCode?sn=${this.sn}&type=pickup`
				})
			},
			handleClickDeliver() {
				// 复制到剪贴板
				uni.setClipboardData({
					data: '123456',
				})
				// uni.navigateTo({
				// 	url: `/pages/order/deliverDetail?order_sn=${this.order.sn}`,
				// });
			},
			// 退款状态枚举
			refundPriceList(status) {
				switch (status) {
					case 'ALL_REFUND':
						return "全部退款";
					case 'PART_REFUND':
						return "部分退款";
					case 'NO_REFUND':
						return "未退款";
					case 'REFUNDING':
						return "退款中";
					default:
						return "";
				}
			},
			callPhone() {
				this.$options.filters.callPhone(this.order.storeAddressMobile)
			},
			//联系客服
			contact(storeId) {
				this.$options.filters.talkIm(storeId)
			},
			goToShopPage(val) {
				uni.navigateTo({
					url: "/pages/product/shopPage?id=" + val.merchant.id,
				});
			},
			// #TODO 这块需要写一下 目前没有拼团的详细信息
			ByUserMessage(order) {
				uni.navigateTo({
					url: "/pages/cart/payment/shareOrderGoods?sn=" +
						order.sn +
						"&sku=" +
						this.orderGoodsList[0].skuId +
						"&goodsId=" +
						this.orderGoodsList[0].goodsId,
				});
			},
			async loadData(sn) {
				uni.showLoading({
					title: "加载中",
				});
				getOrderDetail({
					id: sn
				}).then((res) => {
					const order = res.data;
					this.order = order;
					// this.orderGoodsList = order.orderItems;
					this.orderDetail = res.data;
					if (this.$store.state.isShowToast) {
						uni.hideLoading()
					};
				}).finally(() => {
					uni.hideLoading()
				});

			},
			onReceipt(val) {
				uni.navigateTo({
					url: "/pages/order/invoice/invoiceDetail?id=" + val.id,
				});
			},
			gotoGoodsDetail(sku) {
				uni.navigateTo({
					url: `/pages/product/goods?id=${sku.skuId}&goodsId=${sku.goodsId}`,
				});
			},
			onCopy(sn) {
				this.$options.filters.setClipboard(sn)
			},

			/**
			 * 投诉
			 */
			complaint(sku) {
				uni.navigateTo({
					url: "/pages/order/complain/complain?sn=" +
						this.sn +
						"&skuId=" +
						sku.skuId,
				});
			},
			//售后按钮
			onAfterSales(sn, sku) {
				uni.navigateTo({
					url: `./afterSales/afterSalesSelect?sn=${sn}&sku=${encodeURIComponent(
          JSON.stringify(sku)
        )}`,
				});
			},
			/**
			 * 等待支付
			 */
			waitPay() {
				if (this.order.sign_status == 0) {
					this.$u.debounce(this.toPay(), 3000);
				} else {
					// this.$refs.payList.show()
					//#ifdef MP-WEIXIN
					this.toPay({
						method: 'wechat',
						label: '微信支付'
					})
					// #endif
					//#ifdef MP-ALIPAY
					this.toPay({
						method: 'alipay_credit',
						label: '芝麻免押'
					})
					// #endif
				}
			},
			// 去支付
			toPay(data) {
				// 续租商品
				if (this.orderType === 'renewalOrder') {
					this.renewalOrder(data)
					return;
				}
				// 买断商品
				if (this.orderType === 'buyoutOrder') {
					this.buyoutOrder(data)
					return;
				}
				//#ifndef MP-ALIPAY
				if (data && data.method !== 'wechat') {
					uni.navigateTo({
						url: `/pages/order/payCode?sn=${this.order.id}`
					})
					return
				}
				// #endif
				uni.showLoading({
					title: "加载中",
				});
				if (this.order.sign_status == 0) {
					this.getSignUrl(val)
				} else {
					this.paymentCreate(data)
				}
			},
			paymentCreate(data) {
				let submitData = {
					order_id: this.order.id,
					payment_method: data.method
				};
				// 调用支付
				paymentCreate(submitData).then((res) => {
					console.log('response-----', res)
					//#ifdef MP-WEIXIN
					let response = res.data.data.jsapi_params;
					this.wxrequestPayment(response)
					// #endif
					//#ifdef MP-ALIPAY
					let response = res.data;
					if (data.method === 'alipay_credit') {
						const orderStr = response.freeze_order_string
						this.tradePay(orderStr, 'alipay_credit')
					} else {
						const orderStr = response.data.trade_no
						this.tradePay(orderStr, 'alipay')
					}
					// #endif
				}).finally(() => {
					uni.hideLoading();
				})
			},
			wxrequestPayment(response) {
				const _this = this
				uni.requestPayment({
					provider: "wxpay",
					appid: response.appId,
					timeStamp: response.timeStamp,
					nonceStr: response.nonceStr,
					package: response.package,
					signType: response.signType,
					paySign: response.paySign,
					success: (e) => {
						uni.showToast({
							icon: "none",
							title: "支付成功!",
						});
						setTimeout(() => {
							uni.redirectTo({
								url: `/pages/order/paySuccess?sn=${_this.order.id}&method=wechat`
							})
						}, 1000)
					},
					fail: (e) => {
						console.log('fail----', e)
						// 支付异常或支付失败之后跳转到订单页面
						uni.showModal({
							content: "支付失败,如果您已支付，请勿反复支付",
							showCancel: false,
							success: () => {
								uni.redirectTo({
									url: "/pages/order/order?status=0",
								});
							},
						});
					},
				});
			},
			tradePay(orderStr, type) {
				const data = {}
				if (type === 'alipay_credit') {
					data.orderStr = orderStr
				} else {
					data.tradeNO = orderStr
				}
				const _this = this
				my.tradePay({
					...data,
					success: (payResult) => {
						if (payResult.resultCode === '9000') {
							// 支付成功：跳转到成功页或刷新订单状态
							uni.showToast({
								title: '支付成功',
								icon: 'success'
							});
							setTimeout(() => {
								uni.redirectTo({
									url: `/pages/order/paySuccess?sn=${_this.order.id}&method=alipay`
								})
							}, 1000)
						} else if (payResult.resultCode === '6001') {
							// 用户取消支付
							uni.showToast({
								title: '已取消支付',
								icon: 'none'
							});
						} else {
							// 支付失败（如余额不足、网络问题等）
							uni.showToast({
								title: `支付失败：${payResult.memo || '请重试'}`,
								icon: 'none',
								duration: 3000
							});
						}
					},
					fail: (err) => {
						console.log('唤起支付失败：' + err.errorMessage)
					}
				});
			},
			getSignUrl(data) {
				uni.navigateTo({
					url: `/pages/navigation/webview?type=READ_FILE&sn=${data.id}`
				})
			},
			//删除订单
			deleteOrder(index) {
				uni.showLoading({
					title: "请稍后",
				});
				setTimeout(() => {
					this.navList[this.tabCurrentIndex].orderList.splice(index, 1);
					if (this.$store.state.isShowToast) {
						uni.hideLoading()
					};
				}, 600);
			},
			//取消订单
			onCancel(sn) {
				this.orderSn = sn;
				this.cancelShow = true;
			},

			//提交取消订单（未付款）
			submitCancel() {
				cancelOrder({
					order_id: this.orderSn,
					reason: this.cancel_reason
				}).then((res) => {
					if (res.code === 1) {
						uni.showToast({
							title: "已取消",
							duration: 2000,
							icon: "none",
						});
						this.cancelShow = false;
						setTimeout(() => {
							uni.reLaunch({
								url: "/pages/order/order?status=0",
							});
						}, 500);
					} else {
						uni.showToast({
							title: res.msg,
							duration: 2000,
							icon: "none",
						});
						this.cancelShow = false;
					}
				});
			},

			//确认收货
			onRog(order) {
				this.orderSn = order;
				this.content = '是否确认收货？'
				this.rogShow = true;
			},
			confirmRog() {
				if (this.orderType === 'renewalOrder' || this.orderType === 'buyoutOrder') {
					// this.$refs.payList.show()
					//#ifdef MP-WEIXIN || H5
					this.toPay({
						method: 'wechat',
						label: '微信支付'
					})
					// #endif
					//#ifdef MP-ALIPAY
					this.toPay({
						method: 'alipay',
						label: '支付宝'
					})
					// #endif
				} else {
					this.confirmReceive()
				}
			},
			renewalOrder(data) {
				renewalOrder({
					order_id: this.orderSn.id,
					payment_method: data.method
				}).then(res => {
					if (res.code == 1) {
						//#ifdef MP-WEIXIN
						let response = res.data.data.jsapi_params;
						this.wxrequestPayment(response)
						// #endif
						//#ifdef MP-ALIPAY
						let response = res.data;
						if (data.method === 'alipay_credit') {
							const orderStr = response.freeze_order_string
							this.tradePay(orderStr, 'alipay_credit')
						} else {
							const orderStr = response.payment_data.data.trade_no
							this.tradePay(orderStr, 'alipay')
						}
						// #endif
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}

				})
			},
			buyoutOrder(data) {
				buyoutOrder({
					order_id: this.orderSn.id,
					payment_method: data.method
				}).then(res => {
					if (res.code == 1) {
						//#ifdef MP-WEIXIN
						let response = res.data.data.jsapi_params;
						this.wxrequestPayment(response)
						// #endif
						//#ifdef MP-ALIPAY
						let response = res.data;
						if (data.method === 'alipay_credit') {
							const orderStr = response.freeze_order_string
							this.tradePay(orderStr, 'alipay_credit')
						} else {
							const orderStr = response.data.trade_no
							this.tradePay(orderStr, 'alipay')
						}
						// #endif
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				})
			},
			confirmWl() {
				if (!this.logisticsNo) {
					uni.showToast({
						title: '请输入物流单号',
						icon: 'none'
					})
					return;
				}
				const data = {
					order_id: this.orderSn.id,
					logistics_no: this.logisticsNo
				}
				returnGoods(data).then(res => {
					if (res.code == 1) {
						this.loadData(this.sn);
						this.wlShow = false
					}
					uni.showToast({
						title: res.msg,
						icon: 'none'
					})
				})
			},
			confirmReceive() {
				confirmReceive({
					order_id: this.orderSn.id
				}).then((res) => {
					if (res.code == 1) {
						uni.showToast({
							title: res.msg,
							icon: "none",
						});
						this.loadData(this.sn);
						this.rogShow = false;
					}
				});
			},
			//评价商品
			onComment(sn) {
				uni.navigateTo({
					url: "./evaluate/myEvaluate",
				});
			}, //查看物流
			onLogistics(order) {
				uni.navigateTo({
					url: "/pages/mine/msgTips/packageMsg/logisticsDetail?logi_id=" +
						order.logi_id +
						"&ship_no=" +
						order.ship_no +
						"&order_sn=" +
						order.sn,
				});
			},

			//选择取消原因
			reasonChange(reason) {
				this.reason = reason;
			},
			reBuy(order) {
				uni.navigateTo({
					url: "/pages/product/goods?id=" + order.id + "&goodsId=" + order.goodsId,
				});
			},
		},
	};
</script>

<style lang="scss" scoped>
	@import "./goods.scss";

	.font-icon {
		width: 30px;
		height: 30px;
		text-align: center;
		line-height: 30px;
		border-radius: 50px;
	}

	.empty {
		width: 100%;
	}

	.customer-service {
		background: #ededed;
		// padding: 12rpx 40rpx;
		width: 48%;
		margin: 0 1%;
		height: 55rpx;
		line-height: 55rpx;
		margin-bottom: 10rpx;
		text-align: center;
		font-size: 24rpx;
		border-radius: 10rpx;
	}

	.customer-list {
		display: flex;
		flex-wrap: wrap;
	}

	.logistics-view {
		justify-content: space-between;
		padding: 30rpx !important;
		margin: 0 !important;
	}

	.order-status {
		color: #fff;
		width: 100%;
		text-align: center;
		font-size: 36rpx;
		margin-top: 40rpx;

		>div {
			font-size: 24rpx;
			margin-top: 10rpx;
		}
	}

	.logistics-List-title {
		margin-bottom: 10rpx;
		font-size: 26rpx;
	}

	.logistics-List-time {
		font-size: 24rpx;
		color: #999;
	}

	.info-detail {
		margin-right: 30rpx;
		color: #333;
	}

	.order-view {
		margin: 0 !important;
		border-radius: 0 !important;
		width: 100%;
		height: 200rpx;
		padding: 0 !important;
		background-image: linear-gradient(to right,
				$light-color 0%,
				$aider-light-color 100%) !important;
	}

	page,
	.content {
		background: #f1f1f1;
		height: 100%;
	}

	.info-line {
		align-items: center;
		display: flex;
		border-radius: 30rpx;
		flex-direction: row;
		justify-content: space-between;
		background-color: #fff;
		width: 100%;
		height: 110rpx;
		color: #333333;
		font-size: 28rpx;
		border-bottom: 1rpx solid #eeeeee;

		.info-title {
			margin: 0 30rpx;
			padding: 16rpx 0rpx;
		}
	}

	.seller-view {
		margin: 20rpx 0;
		padding: 15rpx 0;
		border-radius: 30rpx;
	}

	.address-title {
		font-size: 26rpx;
		font-weight: bold;

		>span {
			margin-right: 20rpx;
		}
	}

	.info-view {
		display: flex;
		margin: 0 0 20rpx 0;
		border-radius: 30rpx;
		padding: 15rpx 30rpx;
		margin-bottom: 20rpx;
		background-color: #fff;

		.address-view {
			display: flex;
			flex-direction: row;
			padding: 16rpx 0;

			.address {
				color: $font-color-light;
				overflow: hidden;
				line-height: 1.75;
				font-size: 22rpx;
			}
		}

		.order-info-view {
			line-height: 60rpx;
			display: flex;
			flex-direction: row;
			width: 100%;

			.title {
				color: #666;
				width: 140rpx;
				font-size: 24rpx;
				font-weight: 600;
				flex: 3;
				min-width: 160rpx;
			}

			.value {
				color: #666;
				font-size: 24rpx;
				flex: 10;
			}

			.copy {
				font-size: 20rpx;
				color: #333;
				border: 1px solid #dddddd;
				margin-left: 30rpx;
			}
		}

		.invoice-info-view {
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			width: 100%;
			margin: 10rpx 0rpx;

			.invoice-title {
				width: 550rpx;
				font-size: 28rpx;
				color: #333333;
			}

			.value {
				color: $font-color-light;
			}
		}
	}

	.verificationCode {
		letter-spacing: 2rpx;
	}

	.bottom_view {
		width: 100%;
		// height: 100rpx;
		background-color: #ffffff;
		position: fixed;
		bottom: 0;
		left: 0;

		.btn-view {
			font-size: 26rpx;

			.description {
				color: #909399;
				size: 25rpx;

				.price {
					color: $main-color;
				}
			}
		}

		.cancel-btn {
			color: #999999;
			border-color: #999999;
			margin-left: 15rpx;
			height: 60rpx;
		}
	}

	.cancel-popup {
		.header {
			display: flex;
			flex-direction: row;
			justify-content: center;
			margin: 15rpx 0rpx;
		}

		.body {
			padding: 30rpx;

			.title {
				font-weight: 600;
			}

			.value {
				display: flex;
				flex-direction: column;

				.radio-view {
					margin: 10rpx 0rpx;
				}
			}
		}

		.footer {
			text-align: center;
		}
	}

	.address-line-height {
		line-height: 1.75;
	}

	.seller-name {
		>.name {
			flex: 10 !important;
		}

		>.status {
			flex: 2;
		}
	}
</style>